import React from "react";

const EmptyHeart = ({ color = "white" }: { color?: string }) => {
  return (
    <svg
      width="17"
      height="15"
      viewBox="0 0 17 15"
      fill="none"
      xmlns="http://www.w3.org/2000/svg"
    >
      <path
        d="M12.3636 0C10.7409 0 9.32991 0.755486 8.5 2.02154C7.67009 0.755486 6.25909 0 4.63636 0C3.40716 0.00147795 2.22872 0.506254 1.35954 1.4036C0.490364 2.30094 0.00143156 3.51757 0 4.7866C0 7.11609 1.40636 9.5405 4.18045 11.9912C5.45163 13.1095 6.82474 14.0981 8.28055 14.943C8.34801 14.9804 8.42341 15 8.5 15C8.57659 15 8.65199 14.9804 8.71945 14.943C10.1753 14.0981 11.5484 13.1095 12.8195 11.9912C15.5936 9.5405 17 7.11609 17 4.7866C16.9986 3.51757 16.5096 2.30094 15.6405 1.4036C14.7713 0.506254 13.5928 0.00147795 12.3636 0ZM8.5 13.9697C7.23195 13.2142 0.927273 9.23177 0.927273 4.7866C0.928295 3.77134 1.3194 2.79796 2.01477 2.08006C2.71014 1.36216 3.65297 0.958377 4.63636 0.957321C6.20345 0.957321 7.51941 1.8213 8.07114 3.21261C8.10607 3.3004 8.16549 3.37549 8.24185 3.42833C8.31821 3.48118 8.40807 3.50939 8.5 3.50939C8.59193 3.50939 8.68179 3.48118 8.75815 3.42833C8.83451 3.37549 8.89393 3.3004 8.92886 3.21261C9.48059 1.8213 10.7965 0.957321 12.3636 0.957321C13.347 0.958377 14.2899 1.36216 14.9852 2.08006C15.6806 2.79796 16.0717 3.77134 16.0727 4.7866C16.0727 9.23177 9.76805 13.2142 8.5 13.9697Z"
        fill={color}
      />
    </svg>
  );
};

export default EmptyHeart;
